<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>睡眠数据分析</title>
    <link rel="stylesheet" href="layui-src/dist/css/layui.css">
</head>

<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div class="layui-header">
      <div class="layui-logo"></div>
      <ul class="layui-nav layui-layout-left">

          <li class="layui-nav-item"><a href="indexs.html">睡眠分数和睡眠时长聚类分析</a></li>
          <li class="layui-nav-item"><a href="indexs.html">睡眠分数和深度睡眠时长聚类分析</a></li>
          <li class="layui-nav-item"><a href="index.html">返回大屏</a></li>
          
           
      </ul>
      <ul class="layui-nav layui-layout-right">
        <li class="layui-nav-item">
          <a href="javascript:;">

          </a>
          <dl class="layui-nav-child">
            <dd><a href="http://localhost:8088/">退出系统</a></dd>
          </dl>
        </li>
      </ul>
    </div>
 <blockquote class="layui-elem-quote">分析结果：X轴为深度睡眠时长，Y轴分数。整体上看，用户的睡眠分数和睡眠时间之间呈现较为明显的聚簇分布，故两者之间关系较为密切</blockquote>
<blockquote class="layui-elem-quote">初始中心为: [[3729.353, 81.4], [969.251, 78.4]]<br/>
聚类中心为: [[8373.668789473684, 78.83157894736841], [3999.2203396226414, 80.48113207547168]]</blockquote>
        <div id="map" style="height:600px;margin-left:90px;margin-top:70px"></div>
        <!-- <table class="layui-hide" id="demo" lay-filter="menu-filter"></table> -->
    </div>


    <!--  -->

    <div class="layui-footer">
    </div>
</div>
<script src="layui-src/dist/layui.js"></script>
<script>
</script>
</body>

</html>
<script src="./public/echarts.common.min.js"></script>
<script src="./data/gdps.js"></script>
<script src="./jss/jquery.js"></script>
<script>

$.get('http://localhost:8088/getPart451', function (res) {
    var top20Chart = echarts.init(document.getElementById('map'));
    top20Chart.setOption({
    	
    		  grid: {
    		    left: '3%',
    		    right: '7%',
    		    bottom: '7%',
    		    containLabel: true
    		  },
    		  tooltip: {
    		    // trigger: 'axis',
    		    showDelay: 0,
    		    formatter: function (params) {
    		      if (params.value.length > 1) {
    		        return (
    		          params.seriesName +
    		          ' :<br/>' +
    		          params.value[0] +
    		          '' +
    		          params.value[1] +
    		          ''
    		        );
    		      } else {
    		        return (
    		          params.seriesName +
    		          ' :<br/>' +
    		          params.name +
    		          ' : ' +
    		          params.value +
    		          ' '
    		        );
    		      }
    		    },
    		    axisPointer: {
    		      show: true,
    		      type: 'cross',
    		      lineStyle: {
    		        type: 'dashed',
    		        width: 1
    		      }
    		    }
    		  },
    		  toolbox: {
    		    feature: {
    		      dataZoom: {},
    		      brush: {
    		        type: ['rect', 'polygon', 'clear']
    		      }
    		    }
    		  },
    		  brush: {},
    		  legend: {
    		    data: ['中心点1', '中心点2'],
    		    left: 'center',
    		    bottom: 10
    		  },
    		  xAxis: [
    		    {
    		      type: 'value',
    		      scale: true,
    		      axisLabel: {
    		        formatter: '{value} '
    		      },
    		      splitLine: {
    		        show: false
    		      }
    		    }
    		  ],
    		  yAxis: [
    		    {
    		      type: 'value',
    		      scale: true,
    		      axisLabel: {
    		        formatter: '{value} '
    		      },
    		      splitLine: {
    		        show: false
    		      }
    		    }
    		  ],
    		  series: [
    		    {
    		      name: '中心点1',
    		      type: 'scatter',
    		      emphasis: {
    		        focus: 'series'
    		      },
    		      // prettier-ignore
    		      data: [[252.311,70.6],
[192.143,72.2],
[123.993,71.9],
[150.437,72],
[326.961,70.9],
[313.391,72.8],
[298.251,70.8],
[134.172,71.9],
[163.854,72.9],
[357.988,71.2],
[337.364,71],
[185.39,73.2],
[397.097,71.2],
[384.541,71.3],
[205.778,73.4],
[439.302,71.4],
[452.744,71.5],
[242.018,73.7],
[495.114,72],
[532.481,71.4],
[363.61,73],
[284.269,74.3],
[560.75,72.7],
[543.337,73.8],
[591.098,71.8],
[303.725,74.8],
[638.851,72.9],
[647.352,72.5],
[340.628,75.3],
[726.241,73.3],
[729.457,72.4],
[392.577,75.7],
[808.884,73.5],
[692.269,75.1],
[800.703,72.8],
[452.931,76.2],
[908.963,73.9],
[791.812,75.2],
[908.166,72.9],
[659.826,74.3],
[385.099,73.2],
[535.016,76.1],
[1036.3,73.7],
[898.807,75.5],
[1014.713,73.2],
[433.957,73.8],
[603.965,76.5],
[1191.537,74.1],
[996.086,75.6],
[1044.528,73.5],
[448.477,74.1],
[664.777,76.9],
[1329.669,74.5],
[1066.746,75.9],
[1104.594,73.8],
[501.924,74.3],
[714.857,77],
[1451.945,74.6],
[1135.02,76.2],
[1196.56,74.3],
[521.522,74.5],
[745.981,77.4],
[1590.667,74.7],
[1212.85,76.3],
[1298.555,75],
[1001.145,75.4],
[549.608,74.7],
[818.382,77.6],
[1735.156,74.7],
[1278.816,76.5],
[1386.51,75.2],
[578.61,74.8],
[859.855,78.1],
[1847.773,74.7],
[1357.453,76.7],
[1480.096,75.6],
[634.956,75.2],
[916.703,78.5],
[1976.166,74.9],
[1461.3,76.8],
[1616.349,75.9],
[688.049,75.3],
[969.251,78.4],
[2195.392,74.9],
[1579.543,77.1],
[1596.16,76],
[739.714,75.4],
[1021.247,78.8],
[2424.654,75.1],
[1699.774,77.3],
[1724.332,77.3],
[1459.11,77],
[782.612,75.7],
[1088.959,78.9],
[2684.984,75.3],
[1805.209,77.6],
[1558.033,77.2],
[842.797,75.9],
[1166.43,79.1],
[2901.589,75.5],
[1897.456,77.8],
[2019.308,76.1],
[1651.139,77.5],
[930.701,76.3],
[1253.415,79.2],
[3100.343,75.7],
[1930.889,77.8],
[2040.313,76.1],
[1753.485,77.5],
[995.728,76.2],
[1332.213,79.4],
[3286.558,75.5],
[1962.196,77.9],
[2188.676,76.5],
[1817.042,78],
[1058.68,76.8],
[1420.271,79.8],
[3432.101,75.7],
[1984.944,78],
[2349.145,76.6],
[2100.918,78.1],
[1094.034,76.7],
[1413.445,79.6],
[3586.745,75.7],
[1999.778,78.2],
[2480.217,76.9],
[2169.451,78.2],
[1171.591,76.9],
[1436.372,80.3],
[4158.928,76.1],
[2091.997,78.3],
[2496.201,77.3]

    		            ],
    		      markArea: {
    		        silent: true,
    		        itemStyle: {
    		          color: 'transparent',
    		          borderWidth: 1,
    		          borderType: 'dashed'
    		        },
    		        data: [
    		          [
    		            {
    		              
    		              xAxis: 'min',
    		              yAxis: 'min'
    		            },
    		            {
    		              xAxis: 'max',
    		              yAxis: 'max'
    		            }
    		          ]
    		        ]
    		      },
    		      markPoint: {
    		        data: [
    		          { type: 'max', name: 'Max' },
    		          { type: 'min', name: 'Min' }
    		        ]
    		      },
    		      markLine: {
    		        lineStyle: {
    		          type: 'solid'
    		        },
    		        data: [{ type: 'average', name: 'AVG' }, { xAxis: 160 }]
    		      }
    		    },
    		    {
    		      name: '中心点2',
    		      type: 'scatter',
    		      emphasis: {
    		        focus: 'series'
    		      },
    		      // prettier-ignore
    		      data: [[2236.595,78.6],
[1507.352,77.2],
[1529.586,80.5],
[3894.282,76.5],
[2200.468,78.6],
[2566.003,77.7],
[2321.931,78.8],
[1572.097,77.3],
[1571.107,80.6],
[4061.536,76.7],
[2278.254,78.8],
[2697.878,77.9],
[2431.303,78.9],
[1683.905,77.5],
[1667.922,80.5],
[4261.996,76.7],
[2450.593,79.1],
[2895.533,78.2],
[2687.53,79.2],
[1897.202,77.9],
[1847.786,81.2],
[4536.561,76.7],
[2624.293,79.3],
[3009.368,78.5],
[2875.294,79.3],
[2067.167,78.2],
[1945.556,81.5],
[4888.518,76.9],
[2758.065,79.5],
[3239.77,78.5],
[3152.016,79.4],
[2287.476,78.3],
[2065.133,81.8],
[5316.522,77],
[2914.206,79.6],
[3329.374,78.6],
[3056.265,79.3],
[2469.159,78.4],
[2194.437,81.8],
[5726.538,77.1],
[3122.396,79.9],
[3391.521,79.2],
[3170.947,80.3],
[2724.869,79],
[2303.68,82.1],
[6069.53,77.6],
[3291.912,80],
[3429.955,79.4],
[3264.574,80.4],
[2731.445,79.2],
[2471.186,82],
[6430.757,77.6],
[3486.621,80.4],
[3567.061,79.8],
[3444.855,81],
[2952.329,79.5],
[2561.219,82.4],
[6808.054,77.8],
[3709.615,80.5],
[3750.787,80.1],
[3588.227,81.2],
[3021.671,79.7],
[2689.916,82.6],
[7166.513,78.1],
[3849.544,80.7],
[3955.136,80.2],
[3729.353,81.4],
[3207.853,79.8],
[2799.198,82.7],
[7385.026,78.1],
[3945.873,80.9],
[4158.266,80.3],
[3880.842,81.5],
[3334.506,80.4],
[2971.377,83],
[7645.002,78.5],
[4155.529,81.2],
[4423.07,80.5],
[4045.065,81.8],
[3441.71,80.6],
[3169.19,82.9],
[7879.253,78.6],
[4228.962,81.4],
[4566.678,80.5],
[4161.698,82.3],
[3495.652,81],
[3740.756,82.7],
[8079.467,78.7],
[4336.249,81.6],
[4745.546,80.6],
[4299.434,82.1],
[3614.131,81],
[3970.765,83.2],
[8346.064,78.8],
[4428.753,81.7],
[4951.677,80.6],
[4544.964,82.3],
[3667.636,81.1],
[4308.252,83.4],
[8519.62,78.8],
[4536.81,81.8],
[5151.709,81.2],
[4626.679,82.8],
[3758.935,81.4],
[4328.364,83.7],
[8925.879,78.9],
[4635.285,81.9],
[5295.975,80.7],
[4667.156,82.4],
[3805.82,81],
[4515.556,83.9],
[9355.118,78.7],
[5044.275,82],
[5669.064,81],
[4928.128,82.7],
[3960.141,81.2],
[4295.858,84.1],
[9717.649,78.7],
[5150.47,81.9],
[5970.163,81.1],
[5005.756,82.7],
[4059.125,81.3],
[4412.852,84.2],
[10046.472,78.6],
[5308.356,82],
[6281.84,81],
[5099.306,82.8],
[4189.708,81.3],
[4554.276,84.3],
[10451.386,78.7],
[5189.721,82.2],
[6407.928,81.3],
[5167.839,82.9],
[4385.463,81.4],
[4610.794,84.4],
[10855.517,78.8],
[5828.324,81.7],
[6938.983,81.1],
[5468.418,82.3],
[5018.7,80.4],
[4665.641,84.7],
[11859.179,77]

    		            ],
    		      markArea: {
    		        silent: true,
    		        itemStyle: {
    		          color: 'transparent',
    		          borderWidth: 1,
    		          borderType: 'dashed'
    		        },
    		        data: [
    		          [
    		            {
    		             
    		              xAxis: 'min',
    		              yAxis: 'min'
    		            },
    		            {
    		              xAxis: 'max',
    		              yAxis: 'max'
    		            }
    		          ]
    		        ]
    		      },
    		      markPoint: {
    		        data: [
    		          { type: 'max', name: 'Max' },
    		          { type: 'min', name: 'Min' }
    		        ]
    		      },
    		      markLine: {
    		        lineStyle: {
    		          type: 'solid'
    		        },
    		        data: [{ type: 'average', name: 'Average' }, { xAxis: 170 }]
    		      }
    		    }
    		  ]
    });
  });

</script>